class addTele {                       // JS 语法
    constructor() {
        this.title = '添加电话'
        // this.iconSvg = '<svg >...</svg>'
        this.tag = 'button'
        this.showModal = true
        this.modalWidth = 300
    }

    // 菜单是否需要激活（如选中加粗文本，“加粗”菜单会激活），用不到则返回 false
    isActive(editor) {                      // JS 语法
        return false
    }

    // 获取菜单执行时的 value ，用不到则返回空 字符串或 false
    getValue(editor) {                               // JS 语法
        return false
    }

    // 菜单是否需要禁用（如选中 H1 ，“引用”菜单被禁用），用不到则返回 false
    isDisabled(editor) {                     // JS 语法
        return false
    }

    // 点击菜单时触发的函数
    exec(editor, value) {                              // JS 语法
        // Modal menu ，这个函数不用写，空着即可
    }

    // 弹出框 modal 的定位：1. 返回某一个 SlateNode； 2. 返回 null （根据当前选区自动定位）
    getModalPositionNode(editor) {                             // JS 语法
        return null // modal 依据选区定位
    }

    // 定义 modal 内部的 DOM Element
    getModalContentElem(editor) {                        // JS 语法
        let _this = this
        const $content = document.createElement('div');
        const $button = document.createElement('button');
        $button.textContent = '确认'
        const $input = document.createElement('input');
        $input.maxLength = 11
        $content.style = "display:flex;flex-direction:column;align-items:center;padding:15px;"
        $input.style = "height:36px;border:1px solid #DCDFE6;color:#606266;border-radius:4px;padding:0 15px;"
        $button.style = "margin-top:15px;width:94px;height:36px;padding:10px 0;color:#fff;background:#276684;border-color:#276684;"
        $content.append($input)
        $content.append($button)
        function buttonEvent() {
            let phone = $input.value
            let content = `<textarea disabled 
          style="width:242px;text-align:center;border:none;resize:none;font-size:20px;
          outline:none;vertical-align:bottom;overflow:hidden;text-overflow:ellipsis;
          box-sizing:content-box;" rows="1">{电话号码:${phone}}</textarea>`
            let html = editor.getHtml()
            editor.hidePanelOrModal()
            editor.setHtml(html + content)
        }
        $button.addEventListener('click', buttonEvent)
        return $content // 返回 DOM Element 类型
        // PS：也可以把 $content 缓存下来，这样不用每次重复创建、重复绑定事件，优化性能
    }
}
export default {
    key: 'addTele',
    factory() {
        return new addTele()
    }
}